// 此文件，用来封装 axios 的

import axios from "axios";

// 由于此文件不是组件，所以main.js 里面设置的app.config.globalProperties.$message 不能直接在此文件中使用
// 引入 createDiscreteApi
import { createDiscreteApi } from 'naive-ui';
// 调用createDiscreteApi 得到 message 方法
const { message } = createDiscreteApi(['message'])

// 创建axios实例
const request = axios.create({
    // TODO: 后续这里可以通过 环境变量 来修改；地址是localhost，本地是没问题的，上线就不行了
    baseURL:'http://localhost:3001',
    timeout: 10000,    // 超时时间，10秒
})

// 请求拦截
request.interceptors.request.use(
    (config)=>{
        // TODO: 后续要在 请求头这里 设置上 token
        return config;
    },
    (error)=>{
        return Promise,reject(error);
    }
)

// 响应拦截
request.interceptors.response.use(
    (response)=>{
        // http请求状态码为2xx就会进入这个回调

        // 1. 解构出后端的响应数据 data
        const { data } = response;
        // 2. 判断data.code 是否等于 '200'
        if(data.code === '200'){
            // 请求成功，直接return data ; 然后.then 回调函数的参数 收到的就是这里的data
            return data;
        }else{
            // 请求失败，使用message提示用户
            // alert(data.message || '网络崩了,稍后试试吧！');
            message.error(data.message || '网络崩了,稍后试试吧！');
            
            // 同时，也不希望代码走到 .then 里面，可抛出异常
            throw new Error(data.message || '网络崩了,稍后试试吧！')
        }
        // return response;  不需要这个了
    },
    (error)=>{
        // http状态码不为2xx,就会进入这个回调
        // TODO: 后续可根据不同的状态码 做一些额外的逻辑处理。
        //  比如：401 没有权限，登录过期了。让用户，刷新页面重新登录
        // 403 没有权限，提示用户去申请权限
        return Promise.reject(error);
    }
)

// 导出request
export default request;